<!--
 * @Author: wrh123 482597539@qq.com
 * @Date: 2024-01-11 21:17:38
 * @LastEditors: wrh123 482597539@qq.com
 * @LastEditTime: 2024-01-21 15:17:42
 * @FilePath: /vue-admin/src/views/withdrawal/index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div class="withdrawal">
    <el-card shadow="never">
      <el-form label-width="80px" :inline="true">
        <el-form-item label="申请日期:">
          <el-date-picker
            style="width: 220px;"
            size="mini"
            value-format="yyyy-MM-dd"
            format="yyyy-MM-dd"
            type="daterange"
            range-separator="-"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          />
        </el-form-item>
        <el-form-item label="交易账号:">
          <el-input size="mini" />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" size="mini" @click="subimit">查询</el-button>
        </el-form-item>
      </el-form>
      <el-form label-width="80px" :inline="true">
        <el-form-item label="账户类型:">
          <el-select size="mini" placeholder="请选择账户类型">
            <el-option
              v-for="item in AccountType"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="账户模式:">
          <el-select size="mini" placeholder="请选择账户模式">
            <el-option
              v-for="item in Account"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="考核人:">
          <el-input size="mini" />
        </el-form-item>
        <el-form-item label="申请类型:">
          <el-select size="mini">
            <el-option
              v-for="item in application"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            />
          </el-select>
        </el-form-item>
      </el-form>
    </el-card>
    <el-card shadow="never" style="margin-top: 20px;">
      <el-table
        border
        :data="tableData"
        style="width: 100%"
      >

        <el-table-column
          prop="name"
          align="center"
          label="账户类型"
        />
        <el-table-column
          prop="address"
          align="center"
          label="挑战项目"
        />
        <el-table-column
          prop="address"
          align="center"
          label="所属阶段"
        />
        <el-table-column
          prop="address"
          align="center"
          label="申请类型"
        />
        <el-table-column
          prop="address"
          align="center"
          label="账户模式"
        />
        <el-table-column
          prop="address"
          align="center"
          label="交易账号"
        />
        <el-table-column
          prop="address"
          align="center"
          label="考核金额"
        />
        <el-table-column
          prop="address"
          align="center"
          label="提现金额"
        />
        <el-table-column
          prop="address"
          align="center"
          label="申请人"
        />
        <el-table-column
          prop="address"
          align="center"
          label="开户行"
        />
        <el-table-column
          prop="address"
          align="center"
          label="开户支行"
        />
        <el-table-column
          prop="address"
          align="center"
          label="申请日期"
        />
        <el-table-column
          align="center"
          label="操作"
          width="100px"
        >
          <template>
            <el-button size="mini" type="text" @click="btnOK">已处理</el-button>
            <el-button size="mini" type="text">编辑</el-button>
          </template>
        </el-table-column>

        <el-table-column
          prop="address"
          align="center"
          label="备注"
        />
      </el-table>
      <paging
        :page-size="pageSize"
        :total="total"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      />
      <withdrBtn :dialog-visible.sync="dialogVisible" />
    </el-card>
  </div>
</template>

<script>
import { Account } from '@/utils/index'
import withdrBtn from './components/withdrBtn'
import paging from '@/components/paging.vue'
import { getAccountType } from '@/api/Tradingacct'
export default {
  name: 'VueAdminIndex',
  components: {
    paging,
    withdrBtn
  },
  data() {
    return {
      // 账号模式
      application: [
        { id: 1, name: '全部' },
        { id: 2, name: '盈利分成' },
        { id: 3, name: '报名费' },
        { id: 4, name: '奖励申请' }
      ],
      tableData: [
        {
          address: '你好'
        }
      ],
      currentPage: 1,
      pageSize: 10,
      total: 50,
      dialogVisible: false,
      AccountType: []
    }
  },
  computed: {
    Account() {
      return Account
    }
  },

  mounted() {
    // this.getuseACCouyt()
  },

  methods: {
    async getuseACCouyt() {
      const { data } = await getAccountType()
      this.AccountType = data
    },
    // 查询
    subimit() {

    },
    handleSizeChange(val) {
      this.pageSize = val
      console.log(val, 'www')
      // 处理分页大小改变的逻辑
    },
    handleCurrentChange(val) {
      this.currentPage = val
      // 处理当前页码改变的逻辑
      console.log(val, 'www')
    },
    btnOK() {
      this.dialogVisible = true
    }
  }
}
</script>

<style lang="scss" scoped>
::v-deep .el-input__inner {
  width:160px
}
</style>
